<template>

  <BScroll class="BScroll_title" :bounce="false">
    <div class="category-left-bar">
      <div class="category-left-bar-item"
           v-for="(item,index) in titleList" :class="{active:index===currtype}"
           @click="itemClick(index,item)" >
        {{item.title}}
      </div>
    </div>
  </BScroll>

</template>

<script>
  import BScroll from "../../../components/common/scroll/BScroll";
  export default {
    name: "categoryLeftBar",
    components:{
      BScroll,
    },
    props:{
      titleList:{
        type:Array,
        default(){
          return []
        }
      },
    },
    data(){
      return{
        currtype:0,
      }
    },
    methods:{
      itemClick(index,item){
        this.currtype=index
        this.$emit('itemTitleClick',item.maitKey)
      }
    }
  }
</script>

<style scoped>
  .category-left-bar{
    line-height: 40px;
    text-align: center;
    box-shadow:0px 2px 2px rgba(100,100,100,0.25);
  }
  .active{
    background-color:#999999;

  }
  .BScroll_title{
    position: absolute;
    top: 44px;
    left: 0;
    bottom: 49px;
    overflow: hidden;
    width: 96px;
  }

</style>